$(document).ready(function() {
	var userdata = $('#userdata');
	userdata.append("<tr><td>E-mail: </td><td id='e-mail' onclick='javascript:changeMail()'>"+user.login+"</td></tr>");
	userdata.append("<tr><td>Name: </td><td id = 'name' onclick='changeName()'>"+user.name+"</td></tr>");
	userdata.append("<tr><td>Surname: </td><td id = 'surname' onclick='changeSurname()'>"+user.surname+"</td></tr>");
	userdata.append("<tr><td>Phone: </td><td id = 'phone' onclick='changePhone()'>"+user.phone+"</td></tr>");
	userdata.append("<tr><td>Birthdate: </td><td id = 'birthdate' onclick='changeBirthdate()'>"+user.birthdate+"</td></tr>");
	userdata.append("<tr><td>Bonuses: </td><td id = 'bonuses'  style='color:#777;'>"+user.bonus+"</td></tr>");
    userdata.append("<tr><td>Total bonus gained: </td><td id = 'total_bonus'  style='color:#777;'>"+user.totalBbonus+"</td></tr>");
	userdata.append("<tr><td>Access level: </td><td style='color:#777;'>"+ac+"</td></tr>");
	userdata.append("<tr><td>User group: </td><td style='color:#777;'>"+gr+"</td></tr>");
	$('#pageNavPosition').hide();
	$('#order-table').hide();
	var orderdiv = $('#order_body');
	var k = orders.length;
	$.each(orders, function (index, element)
	{
		var hotel = hotels[index];
		var row = "<tr>";
		row += "<td>" + (index + 1) + "</td>";
		row += "<td style='width:350px'>" + hotel.country+" "+hotel.city+" "+hotel.name+ "</td>";
		row += "<td>" + element.price + "</td>";
		row += "<td>" + element.bonusGained + "</td>";
		row += "<td>" + element.adults + "</td>";
		row += "<td>" + element.children + "</td>";
		row += "<td>" + element.nights + "</td>";
		row += "<td>" + element.orderDate + "</td>";
		row += "<td>" + element.checkInDate + "</td>";
		row += "<td>" + element.checkOutDate + "</td>";
		row += "</tr>";
		orderdiv.append(row);
	});
	if (k > 0)
	{
		$('#order-table').show();
		pager = new Pager('order_body', 10, 'pager', 'pageNavPosition');
		pager.init();
		pager.showPage(1);
	}
	$('#order-count').append(k + " orders.");
});	

function postUpdate(field, value)
{
	$.post("profile", { attr: field, val: value},
			function(data) {
				data = JSON.parse(data);
				if(data.status == "ok")
				{
				$('#dialog').html(field+ " is now "+ value);
				$( "#dialog" ).dialog({

					modal: true,
					buttons: [ { text: "Ok", click: function() { $( this ).dialog( "close" ); }}],
					title: "Success"

				});
				$('#'+field).text(value);
				}
				else if(data.status == "error")
				{
					$('#dialog').html("Error: "+ data.response);
					$( "#dialog" ).dialog({

						modal: true,
						buttons: [ { text: "Ok", click: function() { $( this ).dialog( "close" ); }}],
						title: "Success"

					});

				}
			});
}

function showDialog(title, text, okfunction)
{
	$('#dialog').html(text);
	$( "#dialog" ).dialog({
		dialogClass: "no-close",
		modal: true,
		buttons: [ { text: "Ok", click: function(){okfunction();} }, {text: "Cancel", click: function() { $( this ).dialog( "close" ); }}],
		title: title,
		closeOnEscape: false
	});
}
function changeMail()
{
	showDialog("Change e-mail", "Enter new e-mail"+'</br>'+'<input type="text" id="dialogmail"><br>' +
			'Do not log out until you changed your e-mail.<br>Follow the instructions in the e-mail sent to your new address.' +
			'<br>If you have any problems, contact administrator.',
			function()
			{
				postUpdate("email", $('#dialogmail').val());


			}
	)
}
function changeBirthdate()
{
	showDialog("Change birthdate", "Enter new birthdate"+'</br>'+'<input type="date" id="dialogdate">',
			function()
			{
				postUpdate("birthdate", $('#dialogdate').val());


			}
	)
}
function changeName()
{
	showDialog("Change name", "Enter new name"+'</br>'+'<input type="text" id="dialogname">',
			function()
			{
				postUpdate("name", $('#dialogname').val())
			}
	)
}
function changeLogin()
{
	showDialog("Change login", "Enter new login"+'</br>'+'<input type="text" id="dialoglogin">',        //TODO: validation
			function()
			{
				postUpdate("login", $('#dialoglogin').val())
			}
	)
}
function changeSurname()
{
	showDialog("Change surname", "Enter new surname"+'</br>'+'<input type="text" id="dialogsurname">',
			function()
			{
				postUpdate("surname", $('#dialogsurname').val())
			}
	)
}

function changePhone()
{
	showDialog("Change phone number", "Enter new phone number"+'</br>'+'<input type="text" id="dialogphone">',
			function()
			{
				postUpdate("phone", $('#dialogphone').val())
			}
	)
}

function changePassword()
{
	showDialog("Change password",
			"Enter old password"+
			'</br>'+
			'<input type="text" id="dialogoldpass">'+
			'</br>'+
			"Enter new password"+
			'</br>'+
			'<input type="text" id="dialognewpass">'+
			'</br>',

			function()
			{
				$.post("password", { oldpass: $('#dialogoldpass').val(), newpass: $('#dialognewpass').val()},
						function(data) {

							$('#dialog').html(data);
							$( "#dialog" ).dialog({

								modal: true,
								buttons: [ { text: "Ok", click: function() { $( this ).dialog( "close" ); }}],
								title: "Response"

							});

						});
			}
	)
}